import Paragraph from '@/components/Typography/Paragraph';
import { TextEllipsis } from '@/components/Typography/TextEllipsis';
import Text from '@/components/Typography/Text';
import Title from '@/components/Typography/Title';
import { Link } from 'react-router-dom';
import { DodgeEffect } from '@/components/DodgeEffect';

const Home: React.FC = () => {
  return (
    <div>
      <DodgeEffect />
      <Link to="/index">进入平台</Link>
      <div>Title</div>
      <Title>h1. Ant Design</Title>
      <Title level={2}>h2. Ant Design</Title>
      <Title level={3}>h3. Ant Design</Title>
      <Title level={4}>h4. Ant Design</Title>
      <Title level={5}>h5. Ant Design</Title>
      <Title level={6}>h5. Ant Design</Title>

      <div>Paragraph</div>
      <Paragraph>这是一段文字。使用自定义的Typography组件来展示。</Paragraph>

      <div>Text</div>
      <Text>默认1行：这是一段较长的文字</Text>
      <Text lines={1}>
        显示1行：<h3>这是一段较长的文字</h3>
        ，当它超过设定的行数时，应该自动截断并在末尾显示省略号，
        以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
      </Text>
      <Text lines={2}>
        显示2行：这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
      </Text>
      <TextEllipsis lines={3}>
        <span>TextEllipsis显示3行：</span>
        <span>这是一段较长的文字，当它超过设定的行数时，</span>
        应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
        这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
      </TextEllipsis>
      <TextEllipsis lines={5} style={{ height: 50 }}>
        <span style={{ color: '#f00' }}>TextEllipsis显示3行：</span>
        <span>这是一段较长的文字，当它超过设定的行数时，</span>
        应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
        这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。这是一段较长的文字，当它超过设定的行数时，应该自动截断并在末尾显示省略号，以适应不同大小的容器而不需要固定宽度或高度。
      </TextEllipsis>
    </div>
  );
};
export default Home;
